feat: refine menu-item focus states and sidebar story layouts#606
Merged
Conversation
Align menu-item focus and icon state behavior with selected/default semantics and simplify story coverage to the essential states. Co-authored-by: Cursor <cursoragent@cursor.com>
Move sidebar spacing ownership to slot content and refresh Storybook variants to cover content-only, header search, and profile footer layouts from the latest design. Co-authored-by: Cursor <cursoragent@cursor.com>
isaquebock
previously approved these changes
May 27, 2026
Render sidebar examples from a console-like menu data model so story variants stay aligned with production navigation structure. Co-authored-by: Cursor <cursoragent@cursor.com>
pauloSF0
previously approved these changes
May 28, 2026
robsongajunior
requested changes
May 28, 2026
Restore plain string/boolean summaries in docs tables per review feedback. Co-authored-by: Cursor <cursoragent@cursor.com>
Support top, bottom, left, right, and auto sides with collision-aware positioning so panels open where space allows. Co-authored-by: Cursor <cursoragent@cursor.com>
Expose auto, top, bottom, left, and right in argTypes for the overlay menu. Co-authored-by: Cursor <cursoragent@cursor.com>
Wire the sidebar profile trigger to DropdownMenu with side top, Avatar WithImage pattern, and the Figma account menu items. Co-authored-by: Cursor <cursoragent@cursor.com>
Move vertical scrolling into Sidebar via ScrollArea, drop SidebarGroup scroll prop, and apply header/nav/footer spacing on the shell regions instead of consumer content wrappers. Co-authored-by: Cursor <cursoragent@cursor.com>
Refresh Purpose, Usage composition snippet, ariaLabel prop, and Storybook story list to match the region-based layout API. Co-authored-by: Cursor <cursoragent@cursor.com>
Inject spec Usage into Sidebar docs, drop content padding wrappers, remove SidebarGroup scroll usage, and note ScrollArea is built into Sidebar. Co-authored-by: Cursor <cursoragent@cursor.com>
Remove pb-0 override so the header region keeps consistent spacing on all sides. Co-authored-by: Cursor <cursoragent@cursor.com>
Use data-side attribute selectors instead of BEM --modifier classes so eslint passes, and drop href defaultValue from MenuItem docs per review.
Sidebar profile footer story imported the old content/avatar path removed when avatar moved to a top-level export.
robsongajunior
requested changes
Jun 8, 2026
robsongajunior
requested changes
Jun 8, 2026
robsongajunior
requested changes
Jun 8, 2026
robsongajunior
previously approved these changes
Jun 8, 2026
robsongajunior
previously approved these changes
Jun 8, 2026
robsongajunior
pushed a commit
that referenced
this pull request
Jun 8, 2026
## [3.5.0](https://github.com/aziontech/webkit/compare/@aziontech/webkit@3.4.2...@aziontech/webkit@3.5.0) (2026-06-08) ### Features * refine menu-item focus states and sidebar story layouts ([#606](#606)) ([1840945](1840945))
Contributor
|
🎉 This PR is included in version 3.5.0 🎉 The release is available on:
Your semantic-release bot 📦🚀 |
robsongajunior
pushed a commit
that referenced
this pull request
Jun 12, 2026
## [2.4.0](https://github.com/aziontech/webkit/compare/@aziontech/theme@2.3.2...@aziontech/theme@2.4.0) (2026-06-12) ### Features * Link Figma alignment, MiniButton, and dialog spec checksum ([#623](#623)) ([c576bf1](c576bf1)) * refine menu-item focus states and sidebar story layouts ([#606](#606)) ([1840945](1840945)) ### Bug Fixes * import theme exported primitive ([#639](#639)) ([d5342d2](d5342d2)) * remove redundant/unused buttons ([#640](#640)) ([f25a4e5](f25a4e5))
Contributor
|
🎉 This PR is included in version 2.4.0 🎉 The release is available on:
Your semantic-release bot 📦🚀 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
MenuIteminteraction behavior: focus ring lives on the real interactive element (a/button), icon colors now respond to selected/hover/focus/disabled states, and non-behavioral attrs are forwarded safelyMenuItemstories to a leaner set and fix controls behavior for the default render templateSidebarregions and update sidebar/story templates to define spacing in slot content, including a new header+profile footer layout based on the provided Figma nodeTest plan
eslint --fix+prettier --write)pnpm storybook:devand verify:Webkit/Navigation/MenuItemfocus/hover/selected icon behaviorWebkit/Layout/Sidebarstories: content-only, with header search, and with header+profile footerpnpm storybook:buildMade with Cursor